import React from 'react';
import { Link } from 'react-router-dom';
import InputMobile from 'component/input/input.jsx'
class AddrDetail extends React.Component {
    constructor() {
        super();
        this.state = {
            btnName:'确认添加'
        }
    }
    componentWillMount() {
       if(Object.values(this.props.data).length) {
           this.setState({
            name:  this.props.data.name,
            tel:this.props.data.tel,
            addr:this.props.data.addr,
            addrDetail:this.props.data.addrDetail
           })
        this.setState({  btnName:'确认修改'})
       }
    }
    onValueChange(e) {
        let name = e.target.name,
            value = e.target.value.trim();  //去除空格
        this.setState({ [name]: value });   //键值对,用变量
    }
    submit(e){
        let loginInfo = {
            name: this.state.name,
            tel: this.state.tel,
            addr: this.state.addr,
            addrDetail: this.state.addrDetail
        };
        this.props.submitDate(loginInfo);  
       
    }
    render() {
        return (
            <div>
                   <InputMobile ref='name' text={this.state.name} tip='name' name='用餐人' place='请填写用餐人' changeValue={e=>this.onValueChange(e)} />
                   <InputMobile ref='tel' text={this.state.tel} tip='tel' name='联系电话' place='请填写联系电话' changeValue={e=>this.onValueChange(e)} />
                   <InputMobile ref='addr' text={this.state.addr} tip='addr' name='所属区域' place='请填写所属区域' changeValue={e=>this.onValueChange(e)} />
                   <InputMobile ref='addrDetail' text={this.state.addrDetail} tip='addrDetail' name='送餐地址' place='请填写送餐地址' changeValue={e=>this.onValueChange(e)} />
                <div className="weui-btn xl"  id="addr-btn" onClick={e=>{this.submit(e)}} >{this.state.btnName}</div>
            </div>
        )
    }
}
export default AddrDetail;